import React from 'react';
import { Button, Typography, Badge, Popconfirm, Dropdown, Menu, Space } from '@arco-design/web-react';
import dayjs from 'dayjs';
import PermissionWrapper from '@/components/PermissionWrapper';

const { Text } = Typography;

export const DefaultSorter = {
  field: 'm_id',
  direction: 'desc',
};

export function getColumns(
  t: any,
  callback: (record: Record<string, any>, type: string) => Promise<void>
) {
  return [
    {
      title: t['searchTable.columns.m_id'],
      dataIndex: 'm_id',
      render: (value) => <Text copyable>{value}</Text>,
    },
    {
      title: t['searchTable.columns.charac_no'],
      dataIndex: 'charac_no',
      render: (value) => <Text copyable>{value}</Text>,
    },
    {
      title: t['searchTable.columns.charac_name'],
      dataIndex: 'charac_name',
    },
    {
      title: t['searchTable.columns.operations'],
      dataIndex: 'operations',
      headerCellStyle: { paddingLeft: '15px' },
      render: (_, record) => [
        <Dropdown.Button trigger={'click'} droplist={
          <Menu style={{ maxHeight: '100%' }} onClickMenuItem={(key) => callback(record, key)}>
            <PermissionWrapper
              key={'view'}
              requiredPermissions={[
                { resource: 'game_role_manager', actions: ['api_game_role_info'] },
              ]}
            >
              <Menu.Item key="view">
                <Button
                  type="text"
                  size="small"
                >
                  {t['searchTable.columns.operations.view']}
                </Button>
              </Menu.Item>
            </PermissionWrapper>
            <PermissionWrapper
              key={'update'}
              requiredPermissions={[
                { resource: 'game_role_manager', actions: ['api_game_role_update'] },
              ]}
            >
              <Menu.Item key="update">
                <Button
                  type="text"
                  size="small"
                >
                  {t['searchTable.columns.operations.update']}
                </Button>
              </Menu.Item>
            </PermissionWrapper>
            <PermissionWrapper
              key={'delete'}
              requiredPermissions={[
                { resource: 'game_role_manager', actions: ['api_game_role_delete'] },
              ]}
            >
              <Menu.Item key="delete">
                <Button status="danger" type="text" size="small">
                  {t['searchTable.columns.operations.delete']}
                </Button>
              </Menu.Item>
            </PermissionWrapper>

          </Menu>
        } >
          {t['searchTable.columns.operations']}
        </Dropdown.Button>
      ],
    },
  ];
}

export default function Constants() {
  return (<></>)
}